<template>
  <view class="myContent">
    <view class="portrait">
      <view class="user">
        <image src="@/static/portrait.png" class="portrait"></image>
        <view class="prompt">请登录</view>
      </view>
    </view>
    <view class="my">
      <van-cell title="充值" is-link>
        <template #icon>
          <image src="@/static/gold.png" class="leftIcon"></image>
        </template>
      </van-cell>
      <van-cell title="绑定提现地址和安全密码" is-link>
        <template #icon>
          <image src="@/static/security.png" class="leftIcon"></image>
        </template>
      </van-cell>
      <van-cell title="返佣积分提现" is-link>
        <template #icon>
          <image src="@/static/Withdrawal.png" class="leftIcon"></image>
        </template>
      </van-cell>
      <van-cell title="余额提现积分" is-link>
        <template #icon>
          <image src="@/static/Withdrawal.png" class="leftIcon"></image>
        </template>
      </van-cell>
      <van-cell title="开通邀请码" is-link>
        <template #icon>
          <image src="@/static/invitation.png" class="leftIcon"></image>
        </template>
      </van-cell>
      <van-cell title="积分转余额" is-link>
        <template #icon>
          <image src="@/static/integral.png" class="leftIcon"></image>
        </template>
      </van-cell>
      <van-cell title="审核明细查询" is-link>
        <template #icon>
          <image src="@/static/search.png" class="leftIcon"></image>
        </template>
      </van-cell>
      <van-cell title="资金明细查询" is-link>
        <template #icon>
          <image src="@/static/search.png" class="leftIcon"></image>
        </template>
      </van-cell>
      <van-cell title="购票订单查询" is-link>
        <template #icon>
          <image src="@/static/search.png" class="leftIcon"></image>
        </template>
      </van-cell>
      <van-cell title="代理和返佣" is-link>
        <template #icon>
          <image src="@/static/Withdrawal.png" class="leftIcon"></image>
        </template>
      </van-cell>
      <van-cell title="重置密码" is-link>
        <template #icon>
          <image src="@/static/reset.png" class="leftIcon"></image>
        </template>
      </van-cell>
      <van-cell title="登出" is-link>
        <template #icon>
          <image src="@/static/logout.png" class="leftIcon"></image>
        </template>
      </van-cell>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {}
  }
}
</script>
<style lang="scss" scoped>
.myContent {
  height: 100%;
  background-color: #f8f8f8;
  position: relative;
  .portrait {
    display: flex;
    height: 500rpx;
    background-color: #5181fa;
    .user {
      padding-top: 30rpx;
      height: 100px;
      margin-left: 50rpx;
      display: flex;
      align-items: center;
      image {
        width: 100rpx;
        height: 100rpx;
        border-radius: 50rpx;
      }
      .prompt {
        color: #fff;
        margin-left: 20rpx;
      }
    }
  }

  .my {
    position: absolute;
    padding: 10rpx;
    left: 50%;
    top: 200rpx;
    transform: translate(-50%);
    width: 650rpx;
    background-color: #fff;
    border-radius: 20rpx;
    .van-cell {
      // background-color: transparent;
      .leftIcon {
        width: 40rpx;
        height: 40rpx;
        margin-right: 10rpx;
      }
    }
  }
}
</style>
